@using OurWedding1
@{
    ViewBag.Title = @Resources.GuestGroups;
}

@Html.Partial("_GuestsHeading")

<div id="toolbar" class="ui-widget-header ui-corner-all">

    @Html.ActionLink(Resources.Create_New, "Create", null, new { @class = "createIconLink" })
    @Html.ActionLink(Resources.Guests_List, "Index", "Guests", null, new { @class = "guestsIconLink" })
    @Html.ActionLink(Resources.Summary, "SummaryAjax","Guests", null, new { @class = "summaryButtonLink" })
    @Html.ActionLink(Resources.Confirmations, "Index", "ConfirmationKeys", null, new { @class = "RsvpsIconLink" })
    @Html.ActionLink(Resources.ExportToExcel, "ExcelReport", null, new { @class = "excelButtonLink" })

</div>




<div id="tabs" class="margintop">
    <ul>
        <li><a href="@Url.Action("IndexAjax", "GuestGroups", new { side = 0 })"><img src="~/Content/images/icon-bride.png" alt="" height="24" width="24"/> </a></li>
        <li><a href="@Url.Action("IndexAjax", "GuestGroups", new { side = 1 })"><img src="~/Content/images/icon-bridegroom.png" alt="" height="24" width="24"/></a></li>
        <li><a href="@Url.Action("IndexAjax", "GuestGroups", new { side = 2 })"><img src="~/Content/images/icon-bride.png" alt="" height="24" width="24"/><img src="~/Content/images/icon-bridegroom.png" alt="" height="24" width="24"/></a></li>
    </ul>
</div>

<div id="result"></div>

<div id="spinner" style="display: none">
        @Resources.Ajax_ProcessingData
        <img src="~/Content/images/AjaxLoader.gif" width="16" height="16" alt=""/>
    </div>


@section Scripts{
    @Scripts.Render("~/bundles/functions")
    <script type="text/javascript">
        var retr = '@Resources.RetrievingData <img src="/Content/images/AjaxLoader.gif" width="16" height="16" />';
        $(function () {
            $(".createIconLink").button({
                icons: {
                    primary: "ui-icon-circle-plus"

                }//,
                //text: false
            });

            $(".guestsIconLink").button({
                icons: {
                    primary: "ui-icon-clipboard"

                }//,
                //text: false
            });

            $(".hotelIconLink").button({
                icons: {
                    primary: "ui-icon-home"

                }//,
                //text: false
            });

            $(".RsvpsIconLink").button({
                icons: {
                    primary: "ui-icon-circle-check"

                }//,
                //text: false
            }); //
            
            $(".excelButtonLink").button();
            
            $(".summaryButtonLink").button({
                icons: {
                    primary: "ui-icon-lightbulb"
                }
            }).click(function () {
                $('#result').html($('#spinner').html());
                $("#result").dialog({
                    resizable: false,
                    width: 300,
                    modal: true,
                    buttons: [{ text: "Ok", click: function () { $(this).dialog("close"); } }]
                });
                $.ajax({
                    url: this.href,
                    type: 'GET',
                    //cache: false,
                    //data: { id: "" },
                    success: function (result) {
                        $('#result').html(result);
                    }
                });
                return false;
            });


            $("#tabs").tabs({
                beforeLoad: function (event, ui) {
                    ui.jqXHR.error(function () {
                        ui.panel.html(
                          "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                          "If this wouldn't be a demo.");
                    });
                },
                load: function (event, ui) {
                    formatTable("#tabs");
                    editDeleteIconLinkInit("#tabs");
                }
            });
        });



    </script>

}

